﻿CloudDisk.GridView = function(cfg){
    CloudDisk.AbstractView.apply(this, [cfg]);
    this.el = $('<div class="grid-view"></div>').appendTo(cfg.ct);
};

CloudDisk.GridView.prototype = {

    itemSelector: '.grid-view-item',
	
	createBlankItem: function(){
	    var item = $('<div class="grid-view-item"></div>').append([
		    '<div class="tile-ct">',
	            '<div class="tile-icon"><img src="theme_01/images/icon_file_xls_16.png" /></div>',
	            '<div class="tile-name">',
	                '<span class="checkbox"><span></span></span>',
	                '<input type="text" value="新建文件夹">',
	            '</div>',
            '</div>'
		].join(''));
		this.el.prepend(item);
		item.find('input').on('blur', function(){
		    item.remove();
		}).select();    
	},

	createItem: function(data){
	    var item = $('<div class="grid-view-item"></div>');
		var that = this;
		item.html(this.itemTpl.render(data));
		item.attr('itemId', data.file_id);

		if(data.selected){
		    item.addClass('selected');
		}
		item.on('click', function(e){
		    var tar = $(e.target);
			var itemId = $(this).attr('itemId');
			if(tar.hasClass('tile-icon') || tar[0].nodeName == 'IMG'){
		        that.fireEvent('open', e, itemId);
			} else if($(this).hasClass('selected')){
				$(this).removeClass('selected');
				that.fireEvent('unselect', e, $(this).attr('itemId'));
			} else {
				$(this).addClass('selected');
				that.fireEvent('select', e, $(this).attr('itemId'));
			}
		});
	    return item;
	}

};
CloudDisk.Util.extend(CloudDisk.GridView, CloudDisk.AbstractView);